<template>
	<view class="pt100">
		<view class=" pr kjhbbjdert">
			<view class="pr">
				<view class="cf kjjnxeetsee">
					{{checks.nums}} %
				</view>
				<view class=" fz24 dian pd cen mt20 z9">
					{{checks.texts}}
				</view>
			</view>
			<view class="kjhnmkxeetrwe ssdwwer">
				<image src="../../static/img/yaunxing.png" class=" "></image>
				<view class="uyunjnjhxd">

				</view>
			</view>
		</view>

		<scroll-view scroll-x="true" class="jinhggsdffwai">
			<view class="jinhggsdff pr">
				<image src="../../static/img/jaince.png" class="jiancexeer"></image>
				<view class="row">
					<image src="../../static/img/chehbbss.png" class="jjnnxeeet"></image>
					<view class="col pl30 cf">
						<view class="fz28 mt20">
							LEXUS
						</view>
						<view class="fz28 mt20">
							鲁A·4AV44
						</view>
					</view>
				</view>
				<view class="mt70 row cen">
					<view class="col">
						<view class="pr f_b kjnnxeert">
							<image src="../../static/img/dsdfsfgb.png" class="kknnxeert" mode="widthFix"></image>
							<image src="../../static/img/gantan.png" class="jhnnxjhse" mode="widthFix"></image>
						</view>
						<view class="cf fz28 kjnnxeert">
							蓄电池电压
						</view>
					</view>
					<view class="col">
						<view class="pr f_b">
							<image src="../../static/img/dsdfsfgd.png" class="kknnxeert ab" mode="widthFix"></image>
							<image src="../../static/img/gantan.png" class="jhnnxjhse" mode="widthFix"></image>
						</view>
						<view class="cf fz28 ">
							发动机故障灯
						</view>
					</view>
				</view>
			</view>
			
			
			<view class="jinhggsdff pr">
				<image src="../../static/img/xuanzhgsd.png" class="jiancexeer"></image>
				<view class="row">
					<image src="../../static/img/chehbbss.png" class="jjnnxeeet"></image>
					<view class="col pl30 cf">
						<view class="fz28 mt20">
							LEXUS
						</view>
						<view class="fz28 mt20">
							鲁A·4AV44
						</view>
					</view>
				</view>
				<view class="mt70 row cen">
					<view class="col">
						<view class="pr f_b kjnnxeert">
							<image src="../../static/img/dfsdfa.png" class="kknnxeert" mode="widthFix"></image>
						</view>
						<view class="cf fz28 kjnnxeert">
							蓄电池电压
						</view>
					</view>
					<view class="col">
						<view class="pr f_b">
							<image src="../../static/img/dfsdfb.png" class="kknnxeert ab" mode="widthFix"></image>
						</view>
						<view class="cf fz28 ">
							发动机故障灯
						</view>
					</view>
				</view>
			</view>
		</scroll-view>

	</view>
</template>
<script>
	var i = 0,j = 0
	export default {
		data() {
			return {
				listtext:['动力系统检测','电压检测','车身电脑控制系统检测','底盘电脑控制系统检测','网络连接相关系统检测','电控系统点火提前角检测','发动机控制系统检测','燃油系统状态检测','冷却控制系统检测','气缸缺火检测','综合部件检测','催化器检测','燃油蒸发系统检测','二次空气系统检测','空调制冷检测','氧传感器加热装置检测','系统检测','油耗跟踪检测','怠速稳定性检测','加速性能检测','减速性能检测','润滑控制系统检测','排放控制系统检测'],
				checks:{
					texts:'动力系统检测',
					nums:0
				},
				realTimeClData:"",
				devsn:0
					
			}
		},
		components: {},
		methods: {
			listchange(){
				
				if(j > 100){
					return
				}else{
					this.checks.texts = this.listtext[i]
					this.checks.nums = j
				}
				console.log(i)
				console.log(j)
			}
		},
		onLoad(options){
			var that = this
			that.devsn = options.devsn
			console.log(that.devsn);
			if (!that.$store.state.isintcar && that.islogin() && that.devsn>0) {
				// console.log();
				// 用户登录+车辆jar包初始化+绑定车辆
				uni.showToast({
					title: '初始化车辆' + that.islogin(),
					icon:"none"
				})
				// that.$store.commit('setisintcar', false)
				uni.$emit('carinit', {
					th: that,
					uid: that.islogin()
				})
			}else{
				that.dqGetDevInfo(that.devsn)
				that.sendCom('Cmd_Veh_Check')
				// that.$store.commit('setisintcar', false)
			}
			that.realTimeClData = setInterval(function (e) {
				if(j<100){
					j++;
				}
				if(i< 22){
					i++;
				}
				if(i == 22 && j !=100){
					i = Math.ceil(Math.random()*10); 
				}
				    that.listchange()
				}, 217)
		},
		mounted() {
			var es = this
			setTimeout(function(){
				clearInterval(es.realTimeClData);
				uni.navigateTo({
					url:'physicalExaminationResult'
				})
			},26000)
		}
	}
</script>
<style scoped>
	.kjhbbjdert {
		width: 434upx;
		height: 434upx;
		margin: auto;
	}

	.kjhnmkxeetrwe {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}

	.kjhnmkxeetrwe image {
		width: 100%;
		height: 100%;
	}

	.kjjnxeetsee {
		font-size: 80upx;
		text-align: center;
		padding-top: 140upx;
	}

	.uyunjnjhxd {
		width: 68upx;
		height: 68upx;
		background: linear-gradient(180deg, rgba(27, 213, 185, 1) 0%, rgba(22, 137, 213, 1) 100%);
		border-radius: 50%;
		position: absolute;
		right: 120upx;
		bottom: 40upx;
	}

	.ssdwwer {
		animation: rotating 4s linear infinite
	}

	.jinhggsdffwai {
		white-space: nowrap;
		margin-top: 150upx;
	}
	.jinhggsdff{
		display: inline-block;
		width:604upx;
		height:440upx;
		background:rgba(53,60,81,1);
		border-radius:12upx;
		margin-left: 34upx;
		padding: 40upx;
	}
	.jjnnxeeet{
		width: 160upx;
		height: 160upx;
	}
	.jiancexeer{
		width: 50upx;
		height: 50upx;
		position: absolute;
		right: 40upx;
		top: 40upx;
	}
	.kknnxeert{
		width: 50upx;
	}
	.kknnxeert.ab{
		width: 58upx;
	}
	.jhnnxjhse{
		width: 28upx;
		position: absolute;
		right: -26upx;
		top: -6upx;
	}
	.kjnnxeert{
		height: 70upx;
	}
	
	
	
	
	

	@keyframes rotating {
		from {
			transform: rotate(0)
		}

		to {
			transform: rotate(360deg)
		}
	}
</style>
